import React, {Component} from 'react';
import {Space, Table, Button, Form, Input} from 'antd';
import {AllSchools} from "@/services/DashApi";
import {PageContainer} from "@ant-design/pro-components";
import {Link} from "umi";

const SearchModule = (props) => {

  const {onFilterName} = props

  return (
    <Form
      name="basic"
      layout="inline"
      labelCol={{span: 8}}
      wrapperCol={{span: 16}}
      initialValues={{remember: true}}
      onFinish={(values) => {
        onFilterName(values.keyword)
      }}
      autoComplete="off"
    >
      <Space>
        <Form.Item
          name="keyword"
        >
          <Input style={{width: 163}} name="searchValue" placeholder="请输入关键字"/>
        </Form.Item>
        <Button
          type="primary"
          htmlType="submit"
        >
          搜索
        </Button>
        <Button
          type="default"
          onClick={() => {
            onFilterName("")
          }}
        >
          全部
        </Button>
      </Space>
    </Form>
  )
}

class SchoolLists extends Component {

  state = {
    columns: [
      {
        title: '院校名称',
        dataIndex: 'name',
        key: 'name',
        render: text => <Link to={"/province/schools/item?name="+text}><Button type="link">{text}</Button></Link>,
      },
      {
        title: '层次',
        dataIndex: 'progress',
        key: 'progress',
        sorter: (a, b) => a.progress - b.progress,
        render: text => <span>{text}</span>,
      },
    ],
    data: [],
    originDataSource: [],
    loading: true
  }

  handleFilter = (keyword) => {
    if (!keyword) keyword = ""
    if (this.state.originDataSource.length === 0) {
      this.state.originDataSource = this.state.data
    }
    console.log(this.state.originDataSource.length)
    this.state.data = this.state.originDataSource.filter((current) => {
      return current.name.indexOf(keyword) !== -1})
    this.setState({data: this.state.data})
  }

  componentDidMount() {
    AllSchools().then(response => {
      console.log("@查询所有学校", response)
      const res = []
      for (let i = 0; i < response.univ.length; i++) {
        res[i] = {
          key: `${i + 1}`,
          name: response.univ[i].univ_name,
          number: response.univ[i].univ_code,
          progress: response.univ[i].level,
        }
      }
      this.setState({data: res, loading: false})
      console.log("@res", res)
    }, () => {
      this.setState({loading: false})
    })
  }

  render() {
    return (
      <PageContainer>
        <Space direction="vertical" size="middle" style={{display: 'flex'}}>
          <SearchModule onFilterName={this.handleFilter} />
          <Table<any>
            loading={this.state.loading}
            rowKey={(record) => record.index}
            size="small"
            columns={this.state.columns}
            dataSource={this.state.data}
            pagination={{
              // style: { marginBottom: 0 },
              pageSize: 20,
              showSizeChanger: false,
              showQuickJumper: false
            }}
          />
        </Space>
      </PageContainer>
    );
  }
}

export default SchoolLists;

